<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">

<link rel="stylesheet" type="text/css" media="screen" href="css/smoothness/jquery-ui-1.10.3.custom.min.css" />	<!-- jqueryUI CSS -->
<link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />							<!-- jqGrid CSS -->
<link rel="stylesheet" type="text/css" media="screen" href="css/selfTemplate.css" />						<!-- 本專案自行定義 CSS -->

<script src="js/jquery-1.9.1.min.js"></script>		<!-- jQuery 核心 -->
<script src="js/grid.locale-tw.js" type="text/javascript"></script>											<!-- jqGrid 語系檔 -->
<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>										<!-- jqGrid 核心 -->
<script src="js/jquery-ui-1.10.3.custom.min.js" type="text/javascript"></script>							<!-- jqueryUI 核心 -->
<script src="js/jquery.cookie.js"></script>																	<!-- 操作cookie用 -->
<script src="js/widgets.js" type="text/javascript"></script>												<!-- 本專案自行定義 JS -->

<title>維護人員</title>

<script type="text/javascript">

var tmp = "";


/**
 * 檢查這些 加入、移出
 *	按鈕是否可以被按下
 */
function chkButtonClickAble() {
	$("button").attr("disabled", true );	//先預設不可按下
	
	if ( $("select#inPeople option").size() > 0 ) {	//存在被選中的人，所以可以移出
		if ( $("select#role option:selected").val() != "noselect" ) {	//不等於noselect，所以是有選擇角色
			$("button.remove").attr("disabled",false);	//可以被按下
		}
	}
	if ( $("select#notInPeople option").size() > 0 ) {	//存在未被選中的人，所以可以加入
		if ( $("select#role option:selected").val() != "noselect" ) {	//不等於noselect，所以是有選擇角色
			$("button.add").attr("disabled",false);	//可以被按下
		}
	}
}


/**
 * 依據 角色及子系統，改變inPeople 與 notInPeople 的人員清單
 */ 
function chgPeoList() {
	if ( $("select#subsys  option:selected").val() != "noselect" && $("select#role  option:selected").val() != "noselect" ) {
		$.post("QueryPersonnel",{ fc:"1", subSysId: $("select#subsys  option:selected").val(),roleType: $("select#role  option:selected").val()  },function(reses) {
			$("select#notInPeople option").remove();
			$("select#inPeople option").remove();
			if ( $(reses.inPeople).size() >0 ) {
				$.each(reses.inPeople,function(i, res) {
					tmp = "<option value='"+res.id+"'>"+res.name+"</option>";
					$("select#inPeople").append(tmp);
				});
			}
			if ( $(reses.notInPeople).size() >0 ) {
				$.each(reses.notInPeople,function(i, res) {
					tmp = "<option value='"+res.id+"'>"+res.name+"</option>";
					$("select#notInPeople").append(tmp);
				});
			}
			chkButtonClickAble();
		},"JSON");		
	}
}

$(document).ready(function() {
	
	if ($.cookie("userId") == null) {
		alert("請先登入系統");
		location.assign("index.html");
	} else {

		$("#a_form #loginUser").val( $.cookie("userId") );
		$("#a_form #isSU").val( $.cookie("isSU") );
		/*	先查詢有那些子系統供 Select	*/
		querySubSys("env");
		
		
		$.post("QueryRoleList", { isSU: $.cookie("isSU") }, function(reses) {
			$("select#role option").remove();
			
			$("select#role").append("<option value='noselect'  id='dOpt'>--請選擇--</option>");
			
			if ( $(reses).size() >0 ) {
				$.each(reses,function(i, res) {
					tmp = "<option value='"+res.id+"'>"+res.name+"</option>";
					$("select#role").append(tmp);
				});
			}
		});
		
		$("select#subsys").bind("change", function(){
			$("select#subsys #dOpt").remove();
			chgPeoList();
		});

		$("select#role").bind("change", function(){
			$("select#role #dOpt").remove();
			chgPeoList()
		});
		
		$(".dialog").css("visibility","hidden");
		initPage("角色指派");
		
		$("button.add").attr("disabled",true);
		$("button.remove").attr("disabled",true);
		
		$("button.remove").bind("click", function() {
			/*
			1. 將選的加入 delList
			2. 加入 notInList
			3. 移出 inList
			*/
			tmp = "";
			var selected = "";
			if ( $(this).val() == "sel" ) {
				selected = ":selected";
			}
			
			$("select#inPeople option"+selected ).each( function(){
				tmp += splitTokenONE + $(this).val();
				$("select#notInPeople").append("<option value='"+$(this).val()+"'>"+$(this).html()+"</option>");
				$(this).remove();
			});	
			
			tmp = tmp.substring(splitTokenONE.length, tmp.length  );
			
			chkButtonClickAble();
			
			$.post("ManipulateSubSysMatainer",{actType:"2",subSysId: $("select#subsys  option:selected").val(),delList:tmp,roleType: $("select#role  option:selected").val()  },function(reses) {
			}).fail(function() { alert("Post執行出錯"); });
		});
		
		$("button.add").bind("click", function() {
			/*
			1. 將選的加入 addList
			2. 加入 inList
			3. 移出 notInList
			*/
			tmp = "";
			var selected = "";
			if ( $(this).val() == "sel" ) {
				selected = ":selected";
			}
			
			$("select#notInPeople option"+selected ).each( function(){
				tmp += splitTokenONE + $(this).val();
				$("select#inPeople").append("<option value='"+$(this).val()+"'>"+$(this).html()+"</option>");
				$(this).remove();
			});	
			
			tmp = tmp.substring(splitTokenONE.length, tmp.length  );
			
			chkButtonClickAble();
			
			$.post("ManipulateSubSysMatainer",{actType:"1",subSysId: $("select#subsys  option:selected").val(),addList:tmp,roleType: $("select#role  option:selected").val()  },function(reses) {
			}).fail(function() { alert("Post執行出錯"); });
		});
		
		
	}
	
	$("#isQueryCheck").button({icons:{ primary: "ui-icon-check" }});
	
}).tooltip();
</script>

</head>
<body>

<div id="header"></div>
<p>

<table id="parTable" >
	<tr>
			<th class="right"><label for="bss">系統：</label></th>
			<td colspan="2"><select id="bss"><option>MBMS</option></select></td>
		</tr>
		<tr>
			<th class="right"><label for="subsys">子系統：</label></th>
			<td colspan="2"><select id="subsys"><option value='noselect'  id='dOpt'>--請選擇--</option></select></td>
		</tr>
		<tr>
			<th class="right"><label for="role">角色：</label></th>
			<td><select id="role"><option value='noselect'  id='dOpt'>--請選擇--</option></select></td>
		</tr>
		<tr><td colspan="3">&nbsp;</td> </tr>
		<tr>
			<td  rowspan="4"  >所有人員：<br><select id="notInPeople" multiple="multiple" size="5" ></select></td> 
			<td><button id="butAddAll"   value="all" class="add" type="button">全部加入</button></td>
			<td  rowspan="4"  >選取人員：<br><select id="inPeople" multiple="multiple" size="5" ></select></td>	
		</tr>
		<tr>
			<td><button id="butAddSel"  value="sel" class="add"  type="button">選取加入</button></td>
		</tr>
		<tr>
			 <td><button id="butRemoveSel"  value="sel" class="remove" type="button">選取移除</button></td>
		</tr>
		<tr>
			<td><button id="butRemoveAll"  value="all" class="remove"  type="button">全部移除</button></td>
		</tr>
		
	</table>
<p>
<hr/>
<p>

<form id="a_form">
	<input type="hidden" id="fc" name="fc" />
	<input type="hidden" id="loginUser" name="loginUser" />	<!-- 查詢權限用 -->
	<input type="hidden" id="subSysId" name="subSysId" />
	<input type="hidden" id="isSU" name="isSU" />
</form>


</body>
</html>